<%@ page contentType="text/html; charset=utf-8" %>
<%@ include file="/WEB-INF/jsp/com/include/declare.jspf" %>
<%@ include file="/WEB-INF/jsp/com/include/doctype.jspf" %>
<link rel="stylesheet" type="text/css" href="/kr/common/css/print.css" media="print" />
<%-- 
    JSP Name : counsel_testdrive_inquiry01.jsp
    Description : 시승 예약조회 ( 찾아가는 시승, 방문시승 )
    author SJYoon
    since 2012. 6. 25.
    version 1.0
    Modification Information
       since          author              description
    ===========    =============    ===========================
    2012. 6. 25.     SJYoon     최초 생성
--%>
<script type="text/javascript">
<!--
    //document.domain = HTTP_DOMAIN;
    function addzero(n){
        return n < 10 ? "0"+n : n;
    }

    function update(){
        
        var prctDt = $("#prctDt").text().replaceAll("-", "");
        
        var d = new Date();
        var day = d.getFullYear() + addzero( d.getMonth() +1 ) + addzero( d.getDate() );
        var cenDay = prctDt - day;
        
        if ( cenDay < 2 ){
            alert( " 예약일 2일 전에는 예약취소가 불가능합니다. " );
            return;
        }

        var tsrdPrctNo = $("#tsrdPrctNo").val();
        var tsrdSvcCd = $("#tsrdSvcCd").val();
        var prctSt = $("#prctSt").val();
        var sbcrName = $("#sbcrName").val();
        var sbcrPhone = $("#sbcrPhone").val();
        var prctDt2 = document.frm.prctDt.value;
        var prctTim = $("#prctTim").val();

        var msg = "예약을 취소 하시겠습니까?";
        if ( confirm(msg) ){

            $.post("<c:url value='updateTestDriveInqy.do'/>",
                {
                    'tsrdPrctNo':tsrdPrctNo,
                    'tsrdSvcCd':tsrdSvcCd,
                    'prctSt':prctSt,
                    'sbcrName':sbcrName,
                    'sbcrPhone':sbcrPhone,
                    'prctDt':prctDt2,
                    'prctTim':prctTim
                },
                function(data){
                    var result={};
                    var items = $(data).find("item");
                    items.each(function(index,element){
                       var name = $(this).find("name").text();
                       var value = $(this).find("value").text();
                       result[name] = value;
                    });
                    if(result["result"] =="OK"){
                        alert("예약이 취소되었습니다.");
                        location.replace("/kr/tda/index.do");
                    }
                }  
            );

        }
    }  
    
    function fnPrint(id) {
        
        window.print();
    }
    
//-->
</script>
</head>
<body>
<%@ include file="/WEB-INF/jsp/com/include/layerpopup.jspf" %>
<div id="wrap">
	<%@ include file="/WEB-INF/jsp/com/include/navi_utill_sub.jspf" %>
	<%@ include file="/WEB-INF/jsp/com/include/navi_header.jspf" %>
	<hr />

	<%@ include file="/WEB-INF/jsp/com/include/sub_header_counsel03.jspf" %>
	<hr />

	<div id="container">
		<div id="subtitle-area"><div class="subtitle-area-inner">
			<h4><img src="/kr/images/title/h4_counsel_testdrive_inquiry.gif" alt="예약내용 조회" /></h4>
			<%@ include file="/WEB-INF/jsp/com/include/location.jspf" %>
		</div></div>
		<div id="article">
            <c:if test="${result.tsrdPrctNo != '' }">
			<p class="default-desc"><img src="/kr/images/counsel/txt_counsel_testdrive_inquiry01.gif" alt="카마스터가 확인 전화 후 예약을 확정하여 편리한 시승서비스를 제공하겠습니다. 센터 사정에
			따라 차량의 색상이 변경될 수 있습니다." /></p>
        <div id="printArea">
			<c:if test="${result.tsrdSvcCd == 'S01' || result.tsrdSvcCd == 'S02' }" >
            <div class="reservation-stats">
				<div class="cell">
					<img src="/kr/images/common/icon/icon_car.png" alt="자동차 관련 이미지" class="icon-img" />
					<div class="information">
						<p class="car-name">${result.carn } ${result.carRdonGrade } ${result.xrclCtyNm }</p>
						<p class="car-info">시승 신청하신 차량은<br /><em>${result.carn } ${result.xrclCtyNm }</em> 입니다.</p>
                        
                    <c:choose>
                        <c:when test="${not empty result.vehlImageName}">
                        <img src="/kr/file/imagePathView.do?nrFilNm=trcarimage/${result.vehlImageName}" alt="${result.carn } 이미지" class="car-thumb" width="300" height="180"/>
                        </c:when>
                        <c:when test="${empty result.vehlImageName}">
                        <img src="/kr/temp/@car_300x180.jpg" alt="차량 이미지" class="car-thumb" />
                        </c:when>
                    </c:choose>
                        
					</div>
				</div>
				<div class="cell">
					<img src="/kr/images/common/icon/icon_item.png" alt="항목 관련 이미지" class="icon-img" />
					<div class="information">
						<img src="/kr/images/counsel/txt_counsel_testdrive_inquiry02.gif" alt="차량에 대하여 더 자세한 내용이 궁금하시면 아래 항목을 클릭하여 확인하세요" />
						<ul class="item-list">
                            <li><a href="/kr/showroom.do?carCd1=${result.carCode}"><img src="/kr/images/counsel/txt_counsel_testdrive_inquiry03.gif" alt="차량 상세정보" /></a></li>
                            <li><a href="/kr/estimation/estimationgeneral.do?carcode=${result.carCode}"><img src="/kr/images/counsel/txt_counsel_testdrive_inquiry04.gif" alt="견적내기" /></a></li>
                            <li><a href="/kr/qa/qa/selectQaPaging.do"><img src="/kr/images/counsel/txt_counsel_testdrive_inquiry05.gif" alt="Q&amp;A" /></a></li>
						</ul>
					</div>
				</div>
			</div>
            </c:if>
            <c:if test="${result.tsrdSvcCd == 'S03' }" >
            <div class="reservation-stats stats-type02">
                <div class="cell">
                    <img src="/kr/images/common/icon/icon_car.png" alt="자동차 관련 이미지" class="icon-img" />
                    <div class="information02-wrap">
                        <div class="cell02">
                            <p class="car-name">${result.carn } ${result.carRdonGrade } ${result.xrclCtyNm }</p>
                            <p class="car-info">
                                시승 신청하신 차량은<br />
                                <em>${result.carn } <br />
                                ${result.xrclCtyNm }</em> 입니다.
                            </p>
                            <img src="/kr/file/imagePathView.do?nrFilNm=trcarimage/${ result.vehlImageName }" alt="" class="car-thumb" />
                            <!-- /file/imageView.do?filSn=${ result.cprImgSeq } -->
                        </div>
                        <div class="cell02">
                            <p class="car-name">${result.cprCarn }</p>
                            <p class="car-info">
                                시승 신청하신 차량은<br />
                                <em>${result.cprCarn }</em> 입니다.
                            </p>
                            <img src="/kr/file/imagePathView.do?nrFilNm=tda/${ result.cprImgSeq }" alt="" class="car-thumb" />
                        </div>
                    </div>
                </div>
                <div class="cell">
                    <img src="/kr/images/common/icon/icon_item.png" alt="항목 관련 이미지" class="icon-img" />
                    <div class="information">
                        <img src="/kr/images/counsel/txt_counsel_testdrive_inquiry02.gif" alt="차량에 대하여 더 자세한 내용이 궁금하시면 아래 항목을 클릭하여 확인하세요" />
                        <ul class="item-list">
                            <li><a href="/kr/showroom.do?carCd1=${result.carCode}"><img src="/kr/images/counsel/txt_counsel_testdrive_inquiry03.gif" alt="차량 상세정보" /></a></li>
                            <li><a href="/kr/estimation/estimationgeneral.do"><img src="/kr/images/counsel/txt_counsel_testdrive_inquiry04.gif" alt="견적내기" /></a></li>
                            <li><a href="/kr/qa/qa/selectQaPaging.do"><img src="/kr/images/counsel/txt_counsel_testdrive_inquiry05.gif" alt="Q&amp;A" /></a></li>
                        </ul>
                    </div>
                </div>
            </div>
            </c:if>
			<div class="reservation-information subsection">
				<div class="cell">
					<h5><img src="/kr/images/title/h5_counsel_testdrive_inquiry01.gif" alt="시승 신청 내용" /></h5>
					<div class="boardlist-wrap02">
						<table summary="시승신청 내역">
						<caption>시승신청 내역 목록</caption>
						<colgroup>
							<col width="25%" />
							<col />
						</colgroup>
						<thead>
						<tr>
							<th scope="col">항목</th>
							<th scope="col">내역</th>
						</tr>
						</thead>
						<tbody>
						<tr>
							<td class="bg01">예약 구분</td>
							<td class="last">
                                <c:if test="${result.tsrdSvcCd == 'S01' }">찾아가는 시승 서비스</c:if>
                                <c:if test="${result.tsrdSvcCd == 'S02' }">방문 시승 서비스</c:if>
                                <c:if test="${result.tsrdSvcCd == 'S03' }">수입차 비교시승 서비스</c:if>
                            </td>
						</tr>
						<tr>
							<td class="bg01">예약 상태</td>
							<td class="last">
                                <c:if test="${result.prctSt == 'D'}">
								    <b class="resevervation_wait">예약대기</b>
                                </c:if>
								<c:if test="${result.prctSt == 'O'}">
								    <b class="resevervation_complete">예약확정</b>
                                </c:if>
                                <c:if test="${result.prctSt == 'C'}">
								    <b class="resevervation_cancel">예약취소</b>
								</c:if>
							</td>
						</tr>
						<tr>
							<td class="bg01">시승자 이름</td>
							<td class="last">${result.sbcrName }</td>
						</tr>
						<tr>
							<td class="bg01">휴대폰 번호</td>
							<td class="last">${result.sbcrPhone }</td>
						</tr>
						<tr>
							<td class="bg01">시승센터</td>
							<td class="last">${result.ctrNm}(전화:${result.th1Tn}-${result.th2Tn}-${result.th3Tn})<!-- 서울동부 시승센터 (전화 : 02-973-7365) --></td>
						</tr>
						<tr>
							<td class="bg01">시승차량</td>
							<td class="last">                            
                                ${result.carn}/${result.xrclCtyNm }
                            </td>
						</tr>
						<tr>
							<td class="bg01">시승일시</td>
							<td class="last"><span id="prctDt" >${fn:substring(result.prctDt, 0, 10) }</span> / 
                                <c:if test="${result.prctTim == '10'}">10:00</c:if>
                                <c:if test="${result.prctTim == '12'}">12:00</c:if>
                                <c:if test="${result.prctTim == '14'}">14:00</c:if>
                                <c:if test="${result.prctTim == '16'}">16:00</c:if>
                            </td>
						</tr>
						<tr>
							<td class="bg01">지정카마스터</td>
							<td class="last">
                                <c:if test="${result.cmNm == '' }">미정</c:if>
                                <c:if test="${result.cmNm != '' }">${result.cmNm }</c:if>
                            </td>
						</tr>
						<tr>
							<td class="bg01">시승요청위치</td>
							<td class="last">
								<div class="address-wrap">
									<p>${result.sbcrAddr1 } ${result.sbcrAddr2 } ${result.sbcrAddr3 }<br />
									${result.sbcrAddr4 } ${result.sbcrAddr5 }</p>
								</div>
							</td>
						</tr>
						</tbody>
						</table>
					</div>
					<div class="reservation-tip">
						<em class="point01">* 예약 당일 취소하면 추후 시승서비스 참여에 제약이 있으실 수 있습니다.</em>
						<ul>
							<li><b class="resevervation_wait">예약대기</b> : 담당자가 예약 내용을 확인 중입니다. 빠른 시일 내에 연락 드리도록 하겠습니다.</li>
							<li><b class="resevervation_complete">예약확정</b> : 담당자 확인 후 시승예약이 확정 된 상태 입니다.</li>
							<li><b class="resevervation_cancel">예약취소</b> : 예약이 취소 되었습니다.</li>
						</ul>
					</div>
				</div>
				<div class="cell">
                    <script src="${snsHttpDomain}/sns/testDrive.php?carCode=RV002&js=1" type="text/javascript" charset="utf-8"></script>
                    <!-- 
					<h5><img src="/kr/images/title/h5_counsel_testdrive_inquiry02.gif" alt="연령별 선호도 비교 그래프" /></h5>
					<div class="graph-view">
						<table summary="연령별 선호도">
						<caption>연령별 선호도 정리</caption>
						<tbody>
						<tr>
							<th scope="row">20대</th>
							<td>
								<div class="bar-wrap">
									<img src="/kr/images/common/img_bar_no1.gif" alt="" class="bar" style="width:28%;" />
								</div>
							</td>
						</tr>
						<tr>
							<th scope="row">30대</th>
							<td>
								<div class="bar-wrap">
									<img src="/kr/images/common/img_bar_no2.gif" alt="" class="bar" style="width:24%;" />
								</div>
							</td>
						</tr>
						<tr>
							<th scope="row">40대</th>
							<td>
								<div class="bar-wrap">
									<img src="/kr/images/common/img_bar_no3.gif" alt="" class="bar" style="width:20%;" />
								</div>
							</td>
						</tr>
						<tr>
							<th scope="row">50대</th>
							<td>
								<div class="bar-wrap">
									<img src="/kr/images/common/img_bar_no4.gif" alt="" class="bar" style="width:16%;" />
								</div>
							</td>
						</tr>
						<tr>
							<th scope="row">기타</th>
							<td>
								<div class="bar-wrap">
									<img src="/kr/images/common/img_bar_no5.gif" alt="" class="bar" style="width:12%;" />
								</div>
							</td>
						</tr>
						</tbody>
						</table>
					</div>
					<h5 class="section"><img src="/kr/images/title/h5_counsel_testdrive_inquiry03.gif" alt="색상별 선호도 비교 그래프" /></h5>
					<div class="graph-view">
						<table summary="색상별 선호도">
						<caption>색상별 선호도 정리</caption>
						<tbody>
						<tr>
							<th scope="row">블랙 다이아몬드</th>
							<td>
								<div class="bar-wrap">
									<img src="/kr/images/common/img_bar_no1.gif" alt="" class="bar" style="width:27%;" />
								</div>
							</td>
						</tr>
						<tr>
							<th scope="row">블루블랙</th>
							<td>
								<div class="bar-wrap">
									<img src="/kr/images/common/img_bar_no2.gif" alt="" class="bar" style="width:23%;" />
								</div>
							</td>
						</tr>
						<tr>
							<th scope="row">레밍턴 레드</th>
							<td>
								<div class="bar-wrap">
									<img src="/kr/images/common/img_bar_no3.gif" alt="" class="bar" style="width:19%;" />
								</div>
							</td>
						</tr>
						<tr>
							<th scope="row">순백색</th>
							<td>
								<div class="bar-wrap">
									<img src="/kr/images/common/img_bar_no4.gif" alt="" class="bar" style="width:15%;" />
								</div>
							</td>
						</tr>
						<tr>
							<th scope="row">슬릭실버</th>
							<td>
								<div class="bar-wrap">
									<img src="/kr/images/common/img_bar_no5.gif" alt="" class="bar" style="width:11%;" />
								</div>
							</td>
						</tr>
						<tr>
							<th scope="row">하이퍼 메탈릭</th>
							<td>
								<div class="bar-wrap">
									<img src="/kr/images/common/img_bar_no6.gif" alt="" class="bar" style="width:5%;" />
								</div>
							</td>
						</tr>
						</tbody>
						</table>
					</div>
                    -->
				</div>
			</div>
        </div>
			<div class="btnwrap">
				<a href="javascript:fnPrint('printArea');"><img src="/kr/images/common/button/btn_print.gif" alt="인쇄" /></a>
				<a href="/kr/tda/index.do"><img src="/kr/images/common/button/btn_go_first.gif" alt="처음으로" /></a>
				<a href="javascript:update();"><img src="/kr/images/common/button/btn_reservation_cancel.gif" alt="예약취소" /></a>
			</div>
            </c:if>
            <c:if test="${tsrdPrctNo == '' }">
            <p class="default-desc"><img src="/kr/images/counsel/txt_counsel_testdrive_inquiry01.gif" alt="카마스터가 확인 전화 후 예약을 확정하여 편리한 시승서비스를 제공하겠습니다. 센터 사정에
            따라 차량의 색상이 변경될 수 있습니다." /></p>
            <div class="reservation-stats">
                <div class="cell">            
                    <div class="information">
                        <p class="car-name">예약된 정보가 없습니다.</p>
                    </div>
                </div>
            </div>
            <div class="btnwrap">
                <a href="/kr/tda/index.do"><img src="/kr/images/common/button/btn_go_first.gif" alt="처음으로" /></a>
            </div>
            </c:if>
            <form name="frm" id="frm" method="post" >
                <input type="hidden" name="tsrdPrctNo" id="tsrdPrctNo" value="${result.tsrdPrctNo}" />
                <input type="hidden" name="tsrdSvcCd" id="tsrdSvcCd" value="${result.tsrdSvcCd}" />
                <input type="hidden" name="prctSt" id="prctSt" value="${result.prctSt}" />
                <input type="hidden" name="sbcrName" id="sbcrName" value="${result.sbcrName}" />
                <input type="hidden" name="sbcrPhone" id="sbcrPhone" value="${result.sbcrPhone}" />
                <input type="hidden" name="prctDt" id="prctDt" value="${result.prctDt}" />
                <input type="hidden" name="prctTim" id="prctTim" value="${result.prctTim}" />
            </form>            
		</div>
	</div>
	<hr />
	<%@ include file="/WEB-INF/jsp/com/include/footer.jspf" %>
    <div id="popContents"></div>